<template>
  <div class="ele-body">
    <el-card shadow="never">
      <div slot="header" class="clearfix">
        <span>历史操作记录</span>
      </div>
      <!-- 搜索表单 -->
      <el-form
        :model="where"
        class="ele-form-search"
        label-width="75px"
        @keyup.enter.native="reload"
        @submit.native.prevent
      >
        <div class="app-container">
          <div class="filter-container">
            <el-select
              v-model="where.bazaarId"
              clearable
              placeholder="推广市场"
              style="width: 150px; margin-right: 6px"
              @change="changebazaarId"
            >
              <template v-for="item in bazaarList">
                <el-option
                  v-if="item.status === 1"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                />
              </template>
            </el-select>
            <el-select
              v-model="where.customerid"
              class="filter-item"
              clearable
              placeholder="归属客户"
              style="width: 140px"
              @change="reload"
            >
              <el-option
                v-for="item in customerList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>

            <el-select
              v-model="where.contact"
              class="filter-item"
              clearable
              placeholder="负责人"
              style="width: 140px"
              @change="reload"
            >
              <el-option
                v-for="item in principalList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
            <el-select
              v-model="where.userId"
              clearable
              placeholder="推广账户"
              style="width: 150px; margin-right: 6px"
              @change="reload"
            >
              <template v-for="item in expandList">
                <el-option
                  v-if="item.status === 1"
                  :key="item.userid"
                  :label="item.username"
                  :value="item.userid"
                />
              </template>
            </el-select>

            <el-select
              v-model="where.optLevel"
              clearable
              placeholder="操作层次"
              style="width: 150px; margin-right: 6px"
              @change="reload"
            >
              <template v-for="item in optLevelList">
                <el-option
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </template>
            </el-select>

            <el-select
              v-model="where.optContent"
              clearable
              placeholder="操作对象"
              style="width: 160px; margin-right: 6px"
              @change="reload"
            >
              <template v-for="item in optContentList">
                <el-option
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </template>
            </el-select>

            <el-date-picker
              v-model="daterange"
              :clearable="false"
              :picker-options="pickerOptions"
              end-placeholder="数据结束日期"
              range-separator="-"
              start-placeholder="数据开始日期"
              style="width: 356px; margin-right: 6px"
              type="datetimerange"
              unlink-panels
              value-format="yyyy-MM-dd HH:mm:ss"
              @change="onDateRangeChoose"
            />

            <el-button
              icon="el-icon-search"
              style="margin-right: 6px"
              type="primary"
              @click="reload"
              >搜索
            </el-button>

            <el-button
              icon="el-icon-refresh"
              style="margin-left: 2px"
              @click="reset"
              >重置
            </el-button>
          </div>
        </div>
      </el-form>
      <!-- 数据表格 -->
      <ele-pro-table
        ref="table"
        :columns="columns"
        :datasource="url"
        :max-height="defaultHeight"
        :parse-data="parseData"
        :selection.sync="selection"
        :where="where"
      >
        <!-- 表头工具栏 -->
        <template slot="toolbar">
          <el-button
            v-if="$hasPermission('semhistory:clear')"
            :loading="deleteLoading"
            icon="el-icon-download"
            size="small"
            type="danger"
            @click="deleteData"
            >删除三个月之前日志
          </el-button>

          <el-button
            v-if="$hasPermission('semhistory:update')"
            :loading="refreshLoading"
            icon="el-icon-refresh-right"
            size="small"
            type="success"
            @click="synchronousBatch"
            >获取最新数据
          </el-button>
        </template>

        <!-- 推广账户列 -->
        <template slot="userId" slot-scope="{ row }">
          <template v-for="item in tempexpandList">
            <span v-if="row.userId === item.userid" :key="item.id">
              {{ item.username }}
            </span>
          </template>
        </template>

        <!-- 推广市场列 -->
        <template slot="bazaarId" slot-scope="{ row }">
          <template v-for="item in bazaarList">
            <span v-if="row.bazaarId === item.id" :key="item.id">
              {{ item.name }}
            </span>
          </template>
        </template>

        <!-- 操作层次列 -->
        <template slot="optLevel" slot-scope="{ row }">
          {{ getOptLevelName(row.optLevel) }}
        </template>

        <!-- 操作对象列 -->
        <template slot="optContent" slot-scope="{ row }">
          {{ getContentName(row.optContent) }}
        </template>

        <!-- 操作记录列 -->
        <template slot="newValue" slot-scope="{ row }">
          <!--推广单元-->
          <template v-if="row.optLevel === 1">
            <!--暂停/启用推广-->
            <span v-if="row.optContent === 'shelve'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>
            <!--新增单元-->
            <span v-if="row.optContent === 'addUnit'">
              <span class="history_opticon_add">+</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.newValue }}】
            </span>
            <!--修改单元出价-->
            <span v-if="row.optContent === 'bidPrice'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】出价从{{
                row.oldValue
              }}元至{{ row.newValue }}元
            </span>
            <!--编辑单元名称-->
            <span v-if="row.optContent === 'updUnitName'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.oldValue }}】到【{{
                row.newValue
              }}】
            </span>
            <!--否定关键词-->
            <span v-if="row.optContent === 'negativeWord'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{
                row.optObj
              }}】短语否定关键词【{{ row.newValue }}】
            </span>
            <!--精确否定关键词-->
            <span v-if="row.optContent === 'accurateNegativeWord'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{
                row.optObj
              }}】精确否定关键词【{{ row.newValue }}】
            </span>
            <!--删除单元-->
            <span v-if="row.optContent === 'delUnit'">
              <span class="history_opticon_del">X</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>
          </template>

          <!--推广计划-->
          <template v-if="row.optLevel === 2">
            <!--新建计划-->
            <span v-if="row.optContent === 'addPlan'">
              <span class="history_opticon_add">+</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.newValue }}】
            </span>

            <!--暂停/启用推广-->
            <span v-if="row.optContent === 'shelve'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>

            <!--推广时段管理-->
            <span v-if="row.optContent === 'cycShelve'">
              <span class="history_opticon_mod">△</span>修改未投放时段从【{{
                cycShelve(row.oldValue)
              }}】到【{{ cycShelve(row.newValue) }}】
            </span>

            <!--每日预算-->
            <span v-if="row.optContent === 'dailyBudget'">
              <span v-if="row.optType === 3">
                <span class="history_opticon_mod">△</span>修改{{
                  getOptLevelName(row.optLevel)
                }}【{{ row.optObj }}】预算从【{{
                  dailyBudget(row.oldValue)
                }}】元到【{{ dailyBudget(row.newValue) }}】元
              </span>
              <span v-else>
                <span v-if="row.optType === 2" class="history_opticon_add"
                  >+</span
                >
                <span v-else class="history_opticon_mod">△</span>
                {{ getOptTypeName(row.optType)
                }}{{ getOptLevelName(row.optLevel) }}【{{
                  row.optObj
                }}】预算从【{{ dailyBudget(row.oldValue) }}】元到【{{
                  dailyBudget(row.newValue)
                }}】元
              </span>
            </span>

            <!--推广地域-->
            <span v-if="row.optContent === 'zone'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】从【{{
                zone(row.oldValue)
              }}】到【{{ zone(row.newValue) }}】
            </span>

            <!--精确否定关键词-->
            <span v-if="row.optContent === 'accurateNegativeWord'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{
                row.optObj
              }}】精确否定关键词【{{ row.newValue }}】
            </span>

            <!--否定关键词-->
            <span v-if="row.optContent === 'negativeWord'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{
                row.optObj
              }}】短语否定关键词【{{ row.newValue }}】
            </span>

            <!--删除推广计划-->
            <span v-if="row.optContent === 'delPlan'">
              <span class="history_opticon_del">X</span>
              {{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>
          </template>

          <!--帐户操作-->
          <template v-if="row.optLevel === 3">
            <!--日预算-->
            <span v-if="row.optContent === 'budgetDay2Day'">
              <span class="history_opticon_mod">△</span>修改账户日预算从【{{
                dailyBudget(row.oldValue)
              }}】到【{{ dailyBudget(row.newValue) }}】元
            </span>

            <!--推广地域-->
            <span v-if="row.optContent === 'zone'">
              <span class="history_opticon_mod">△</span>修改账户推广地域从【{{
                row.oldValue
              }}】到【{{ row.newValue }}】
            </span>
          </template>

          <!--创意操作-->
          <template v-if="row.optLevel === 4">
            <!--新建创意-->
            <span v-if="row.optContent === 'addIdea'">
              <span class="history_opticon_add">+</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.newValue }}】
            </span>

            <!--删除创意-->
            <span v-if="row.optContent === 'delIdea'">
              <span class="history_opticon_del">X</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>

            <!--暂停/启用推广-->
            <span v-if="row.optContent === 'shelve'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>

            <!--编辑创意-->
            <span v-if="row.optContent === 'updIdea'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】【{{
                updWordUrl(row.oldValue)
              }}】到【{{ updWordUrl(row.newValue) }}】
            </span>

            <!--编辑创意-->
            <span v-if="row.optContent === 'shelveIdea'">
              <span>{{ row.optObj }}</span>
            </span>

            <!--修改设备偏好-->
            <span v-if="row.optContent === 'deviceOpt'">
              <span class="history_opticon_mod">△</span>{{ row.optObj }}
            </span>
          </template>

          <!--关键词操作-->
          <template v-if="row.optLevel === 5">
            <!--新增关键词-->
            <span v-if="row.optContent === 'addUrl'">
              <span class="history_opticon_add">+</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.newValue }}】
            </span>

            <!--添加关键词-->
            <span v-if="row.optContent === 'addWord'">
              <span class="history_opticon_add">+</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.newValue }}】
            </span>

            <!--暂停/启用推广-->
            <span v-if="row.optContent === 'shelve'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>

            <!--修改单元出价-->
            <span v-if="row.optContent === 'bidPrice'">
              <span class="history_opticon_mod">△</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{
                row.optObj
              }}】出价从【{{ dailyBudget(row.oldValue) }}】元到【{{
                dailyBudget(row.newValue)
              }}】元
            </span>

            <!--匹配方式-->
            <span v-if="row.optContent === 'updWordMatch'">
              <span class="history_opticon_mod">△</span>修改关键词【{{
                row.optObj
              }}】匹配方式从【{{ row.oldValue }}】到【{{ row.newValue }}】
            </span>

            <!--移动URL-->
            <span v-if="row.optContent === 'updWordUrl'">
              <span class="history_opticon_mod">△</span>修改关键词【{{
                row.optObj
              }}】计算机访问网址从【{{ updWordUrl(row.oldValue) }}】到【{{
                updWordUrl(row.newValue)
              }}】
            </span>

            <!--移动URL-->
            <span v-if="row.optContent === 'updWordMobileUrl'">
              <span class="history_opticon_mod">△</span>修改关键词【{{
                row.optObj
              }}】计算机访问网址从【{{ updWordUrl(row.oldValue) }}】到【{{
                updWordUrl(row.newValue)
              }}】
            </span>

            <!--删除关键词-->
            <span v-if="row.optContent === 'delWord'">
              <span class="history_opticon_del">X</span
              >{{ getOptTypeName(row.optType)
              }}{{ getOptLevelName(row.optLevel) }}【{{ row.optObj }}】
            </span>
          </template>
        </template>
      </ele-pro-table>
    </el-card>

    <!-- 弹出同步窗口 -->
    <el-dialog
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :destroy-on-close="true"
      :lock-scroll="false"
      :title="'获取最新数据'"
      :visible.sync="synchronousShow"
      class="ele-dialog-view"
      custom-class="ele-dialog-form"
      width="640px"
      @closed="synchronousForm = {}"
    >
      <el-form ref="synchronousForm" :model="synchronousForm">
        <div style="height: 350px">
          <div
            :style="{
              'border-radius': '4px',
              float: 'left',
              'margin-left': '10px',
              width: '170px',
              'pointer-events': isLeftDisabled ? 'none' : '',
              opacity: isLeftDisabled ? '.7' : '1.0',
            }"
          >
            <div style="margin: 6px 0"><span>请选择要同步的账户</span></div>
            <el-checkbox
              v-model="handleCheckAll"
              :indeterminate="isIndeterminate"
              @change="handleCheckAllChange"
              >全选/反选
            </el-checkbox>
            <div style="margin: 10px 0"></div>
            <div class="ele-left-layout">
              <el-checkbox-group
                v-model="checkedUserId"
                @change="handlecheckedUserIdChange"
              >
                <template v-for="item in tempexpandList">
                  <el-checkbox
                    v-if="item.status === 1"
                    :key="item.id"
                    :label="item.userid"
                    style="width: 140px; font-size: 12px"
                    >{{ item.username }}
                  </el-checkbox>
                </template>
              </el-checkbox-group>
            </div>
          </div>
          <div class="ele-right-layout">
            <div style="margin: 6px 0"><span>同步结果</span></div>
            <div>
              <el-input
                v-model="synchronousResult"
                :readonly="true"
                resize="none"
                type="textarea"
              />
            </div>
          </div>
        </div>
      </el-form>
      <div slot="footer">
        <el-button size="medium" @click="synchronousShow = false"
          >取消</el-button
        >
        <el-button
          :loading="synchronousLoading"
          size="medium"
          type="primary"
          @click="synchronousSave"
          >更新
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "semHistory",
  data() {
    return {
      //归属客户
      customerList: [],
      //负责人
      principalList: [],

      // 同步账户选中账户
      checkedUserId: [],
      // 同步账户选中账户
      handleCheckAll: false,
      // 同步账户选中账户
      isIndeterminate: false,
      // 同步账户选中账户
      isLeftDisabled: false,

      // 同步表单数据
      synchronousForm: {},
      // 同步表单按钮
      synchronousLoading: false,
      // 是否显示编辑弹窗
      synchronousShow: false,
      // 同步数据结果
      synchronousResult: "",

      // 操作层次
      optLevelList: [
        { value: 3, label: "帐户" },
        { value: 2, label: "计划" },
        { value: 1, label: "单元" },
        { value: 4, label: "创意" },
        { value: 5, label: "关键词" },
      ],
      // 操作对象
      optContentList: [
        { value: "zone", label: "地域" },
        { value: "dailyBudget", label: "预算" },
        { value: "cycShelve", label: "时段" },
        { value: "shelve", label: "暂停/启用" },
        { value: "updWordMatch", label: "匹配方式" },
        { value: "bidPrice", label: "关键词出价" },
        { value: "addWord", label: "添加关键词" },
        { value: "delWord", label: "删除关键词" },
        { value: "negativeWord", label: "否定关键词" },
        { value: "accurateNegativeWord", label: "精确否定关键词" },
        { value: "updWordUrl", label: "关键词URL" },
        { value: "addIdea", label: "新建创意" },
        { value: "delIdea", label: "删除创意" },
        { value: "updIdea", label: "编辑创意" },
        { value: "ipExclude", label: "IP排除" },
      ],
      // 账户列表
      expandList: [],
      //账户列表
      tempexpandList: [],
      //市场列表
      bazaarList: [],
      // 表格高度
      defaultHeight: 0,
      // 筛选日期范围
      daterange: this.getDaterange(),
      // 清除按钮加载状态
      deleteLoading: false,
      // 清除按钮加载状态
      refreshLoading: false,
      // 日期时间选择器快捷项
      pickerOptions: {
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime());
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime() + 24 * 60 * 60 * 1000);
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 24 * 60 * 60 * 1000);
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一周",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 7 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近半月",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 15 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 30 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 90 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近半年",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 180 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一年",
            onClick(picker) {
              let start = new Date();
              start.setTime(start.getTime() - 365 * (24 * 60 * 60 * 1000));
              start =
                start.getFullYear() +
                "-" +
                (start.getMonth() + 1) +
                "-" +
                start.getDate() +
                " 00:00:00";
              let end = new Date();
              end.setTime(end.getTime());
              end =
                end.getFullYear() +
                "-" +
                (end.getMonth() + 1) +
                "-" +
                end.getDate() +
                " 00:00:00";
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      // 表格数据接口
      url: "/semhistory/method",
      // 表格列配置
      columns: [
        {
          columnKey: "index",
          type: "index",
          width: 80,
          label: "序号",
          align: "center",
          showOverflowTooltip: true,
        },
        {
          prop: "userId",
          label: "推广账户",
          slot: "userId",
          sortable: "custom",
          showOverflowTooltip: true,
        },
        {
          prop: "bazaarId",
          label: "推广市场",
          slot: "bazaarId",
          sortable: "custom",
          showOverflowTooltip: true,
        },
        {
          prop: "optLevel",
          label: "操作层次",
          slot: "optLevel",
          sortable: "custom",
          showOverflowTooltip: true,
        },
        {
          prop: "optContent",
          label: "操作对象",
          slot: "optContent",
          sortable: "custom",
          showOverflowTooltip: true,
        },
        {
          prop: "newValue",
          label: "操作记录",
          slot: "newValue",
          sortable: "custom",
          showOverflowTooltip: true,
        },
        {
          prop: "optTime",
          label: "操作时间",
          sortable: "custom",
          showOverflowTooltip: true,
          formatter: (row, column, cellValue) => {
            return this.$util.toDateString(cellValue);
          },
        },
      ],
      // 表格搜索条件
      where: {},
      // 表格选中数据
      selection: [],
    };
  },
  created() {
    window.addEventListener("resize", this.getHeight);
    this.getHeight();
  },

  methods: {
    handleCheckAllChange(val) {
      let userId = [];
      for (let i = 0; i < this.tempexpandList.length; i++) {
        if (this.tempexpandList[i].status === 1) {
          userId.push(this.tempexpandList[i].userid);
        }
      }
      this.synchronousResult = "";
      this.checkedUserId = val ? userId : [];
      this.isIndeterminate = false;
    },

    handlecheckedUserIdChange(value) {
      let checkedCount = 0;
      for (let i = 0; i < this.tempexpandList.length; i++) {
        if (this.tempexpandList[i].status === 1) {
          checkedCount++;
        }
      }
      let count = value.length;
      this.synchronousResult = "";
      this.handleCheckAll = count === checkedCount;
      this.isIndeterminate = count > 0 && count < checkedCount;
    },

    changebazaarId(id) {
      let arrayList = [];
      this.where.userId = "";
      for (let i = 0; i < this.tempexpandList.length; i++) {
        if (this.tempexpandList[i].bazaarId === id) {
          arrayList.push(this.tempexpandList[i]);
        }
      }
      this.expandList = arrayList;
      this.reload();
    },

    /* 开始同步账户 */
    synchronousSave() {
      if (this.checkedUserId.length === 0) {
        this.$message.error("请选择要同步的账户!");
        return;
      }
      this.$refs["synchronousForm"].validate((valid) => {
        if (valid) {
          this.isLeftDisabled = true;
          this.synchronousLoading = true;
          let requestArrayName = [],
            requestArray = [],
            userArrayName = [];
          for (let i = 0; i < this.tempexpandList.length; i++) {
            if (
              this.checkedUserId.indexOf(this.tempexpandList[i].userid) > -1
            ) {
              requestArrayName.push(
                "[" + this.tempexpandList[i].username + "] 开始同步数据.\n"
              );
              userArrayName.push(this.tempexpandList[i].username);
              requestArray.push(
                this.$http.put("/semhistory/synchronous", {
                  userId: this.tempexpandList[i].userid,
                })
              );
            }
          }
          this.synchronousResult = requestArrayName.join("");
          Promise.all(requestArray)
            .then((items) => {
              items.forEach((item, index) => {
                requestArrayName.push(
                  "[" + userArrayName[index] + "] " + item.data.msg + ".\n"
                );
              });
              this.synchronousResult = requestArrayName.join("");
              this.checkedUserId = [];
              this.isLeftDisabled = false;
              this.handleCheckAll = false;
              this.isIndeterminate = false;
              this.synchronousLoading = false;
              this.reload();
            })
            .catch((e) => {
              this.synchronousResult = "网络异常同步失败!";
              this.synchronousLoading = false;
              this.isLeftDisabled = false;
              this.$message.error(e.message);
            });
        } else {
          return false;
        }
      });
    },

    /* 同步账户数据 */
    synchronousBatch() {
      if (!this.$hasPermission("semhistory:update")) {
        return this.$message.error("你没有权限执行此操作!");
      }
      this.synchronousForm = {};
      this.synchronousResult = "";
      this.synchronousLoading = false;
      this.synchronousShow = true;
    },

    /* 删除日志 */
    deleteData() {
      if (!this.$hasPermission("semhistory:clear")) {
        return this.$message.error("你没有权限执行此操作!");
      }
      this.$confirm("该操作不可恢复, 确定是否删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.deleteLoading = true;
        this.$http
          .delete("/semhistory/clearLog")
          .then((res) => {
            this.deleteLoading = false;
            if (res.data.code === 0) {
              this.$message({ type: "success", message: res.data.msg });
              this.reload();
            } else {
              this.$message.error(res.data.msg);
            }
          })
          .catch((e) => {
            this.deleteLoading = false;
            this.$message.error(e.message);
          });
      });
    },

    dailyBudget(t) {
      return t <= 0 ? 0 : "-" === t ? "不限定预算" : parseFloat(t).toFixed(2);
    },
    cycShelve(t) {
      return "-" === t ? "无" : t;
    },
    updWordUrl(t) {
      return t ? t : "不设置";
    },
    zone(t) {
      return "-" == t ? "计划推广地域" : t;
    },
    /*取操作类型 */
    getOptTypeName(value) {
      let result = "";
      switch (value) {
        case 1:
          result = "设置";
          break;
        case 2:
          result = "新增";
          break;
        case 3:
          result = "删除";
          break;
        case 4:
          result = "修改";
          break;
        case 5:
          result = "暂停";
          break;
        case 6:
          result = "启用";
          break;
        case 7:
          result = "重命名";
          break;
        case 8:
          result = "激活";
          break;
        case 9:
          result = "取消";
          break;
        case 10:
          result = "系统激活";
          break;
        case 11:
          result = "关键词转移";
          break;
      }
      return result;
    },

    /*取操作对象 */
    getContentName(value) {
      const zhArray = [
        "新增关键词",
        "每日预算",
        "日预算",
        "日预算",
        "周预算",
        "周预算",
        "推广地域",
        "激活时长设置",
        "IP排除",
        "搜索意图定位",
        "动态创意",
        "修改搜索合作网络出价",
        "新建计划",
        "删除推广计划",
        "暂停/启用推广",
        "推广时段管理",
        "每日预算",
        "推广地域",
        "IP排除",
        "展现方式",
        "否定关键词",
        "精确否定关键词",
        "参加网盟推广",
        "网盟推广出价",
        "勾选投放设备",
        "切换投放设备",
        "推广电话",
        "商桥移动咨询",
        "修改移动出价",
        "搜索意图定位",
        "动态创意",
        "新建单元",
        "删除单元",
        "暂停/启用推广",
        "修改单元出价",
        "编辑单元名称",
        "否定关键词",
        "精确否定关键词",
        "修改移动出价比例",
        "分匹配模式出价",
        "修改分匹配模式出价",
        "添加关键词",
        "删除关键词",
        "暂停/启用推广",
        "修改关键词出价",
        "匹配方式",
        "激活关键词",
        "转移关键词",
        "关键词URL",
        "移动URL",
        "接受/不接受分匹配模式出价",
        "新建创意",
        "删除创意",
        "暂停/启用推广",
        "编辑创意",
        "激活创意",
        "修改设备偏好",
        "新建子链",
        "删除子链",
        "编辑子链",
        "暂停/启用子链",
        "新建app推广",
        "删除app推广",
        "修改app推广",
        "暂停/启用app推广",
        "新建推广电话",
        "删除推广电话",
        "编辑推广电话",
        "暂停/启用推广电话",
        "新建商桥移动咨询",
        "删除商桥移动咨询",
        "暂停/启用商桥移动咨询",
        "新建网页回呼",
        "删除网页回呼",
        "编辑网页回呼",
        "暂停/启用网页回呼",
        "新建动态创意",
        "删除动态创意",
        "修改动态创意",
        "暂停/启用动态创意",
      ];
      const enArray = [
        "addUrl",
        "dailyBudget",
        "budgetDay2Day",
        "budgetDay2Week",
        "budgetWeek2Day",
        "budgetWeek2Week",
        "zone",
        "materialActive",
        "ipExclude",
        "queryRegion",
        "dynamicIdeaStat",
        "updExternalFlow",
        "addPlan",
        "delPlan",
        "shelve",
        "cycShelve",
        "dailyBudget",
        "zone",
        "ipExclude",
        "showFac",
        "negativeWord",
        "accurateNegativeWord",
        "cproJoin",
        "setCproPrice",
        "deviceCfgStat",
        "targetDevice",
        "phoneNumber",
        "bridge",
        "mobilePrice",
        "queryRegion",
        "dynamicIdeaStat",
        "addUnit",
        "delUnit",
        "shelve",
        "bidPrice",
        "updUnitName",
        "negativeWord",
        "accurateNegativeWord",
        "mobilePriceFactor",
        "matchPriceFactorStatus",
        "matchPriceFactor",
        "addWord",
        "delWord",
        "shelve",
        "bidPrice",
        "updWordMatch",
        "active",
        "wordTransfer",
        "updWordUrl",
        "updWordMobileUrl",
        "matchPrefer",
        "addIdea",
        "delIdea",
        "shelve",
        "updIdea",
        "active",
        "deviceOpt",
        "addSublink",
        "delSublink",
        "updSublink",
        "shelveSublink",
        "addAppCreative",
        "delAppCreative",
        "updAppCreative",
        "shelveAppCreative",
        "addPhoneCreative",
        "delPhoneCreative",
        "updPhoneCreative",
        "shelvePhoneCreative",
        "addBridgeCreative",
        "delBridgeCreative",
        "shelveBridgeCreative",
        "addLXBCreative",
        "delLXBCreative",
        "updLXBCreative",
        "shelveLXBCreative",
        "addDynamicIdea",
        "delDynamicIdea",
        "updDynamicIdea",
        "shelveDynamicIdea",
      ];
      let key = enArray.indexOf(value);
      if (key === -1) {
        return "none";
      }
      return zhArray[key];
    },

    /*取层次名称 */
    getOptLevelName(value) {
      let result = "";
      switch (value) {
        case 1:
          result = "推广单元";
          break;
        case 2:
          result = "推广计划";
          break;
        case 3:
          result = "帐户";
          break;
        case 4:
          result = "创意";
          break;
        case 5:
          result = "关键词";
          break;
        case 7:
          result = "蹊径子链";
          break;
        case 8:
          result = "App推广";
          break;
        case 9:
          result = "推广电话";
          break;
        case 10:
          result = "商桥";
          break;
        case 11:
          result = "页面回呼";
          break;
        case 12:
          result = "动态创意";
          break;
      }
      return result;
    },

    /*默认时间*/
    getDaterange() {
      let start = new Date();
      start.setTime(start.getTime());
      start =
        start.getFullYear() +
        "-" +
        (start.getMonth() + 1) +
        "-" +
        start.getDate() +
        " 00:00:00";
      let end = new Date();
      end.setTime(end.getTime() + 24 * 60 * 60 * 1000);
      end =
        end.getFullYear() +
        "-" +
        (end.getMonth() + 1) +
        "-" +
        end.getDate() +
        " 00:00:00";
      return [start, end];
    },

    /* 日期选择改变回调 */
    onDateRangeChoose() {
      if (this.daterange && this.daterange.length === 2) {
        this.where.createTimeStart = this.daterange[0];
        this.where.createTimeEnd = this.daterange[1];
      } else {
        this.where.createTimeStart = null;
        this.where.createTimeEnd = null;
      }
    },

    /*设置表格高度*/
    getHeight() {
      this.defaultHeight = window.innerHeight - 360;
    },

    /*表格数据加载*/
    parseData(res) {
      if (res.code === 0) {
        this.tempexpandList = res.expand;
        this.customerList = res.customer;
        this.principalList = res.principal;
        this.bazaarList = res.bazaar;
      }
      return {
        code: res.code,
        data: res.data,
        count: res.count,
        msg: res.msg,
      };
    },

    /* 刷新表格 */
    reload(isPage) {
      let obj = { where: this.where };
      if (!isPage) {
        obj.page = 1;
      }
      this.$refs.table.reload(obj);
    },

    /* 重置搜索 */
    reset() {
      for (let key in this.where) {
        this.where[key] = null;
      }
      let daterange = this.getDaterange();
      if (daterange.length === 2) {
        this.where.createTimeStart = daterange[0];
        this.where.createTimeEnd = daterange[1];
      }
      this.daterange = daterange;
      this.reload();
    },
  },
};
</script>

<style scoped>
.ele-dialog-view /deep/ .el-dialog__body {
  padding: 16px 20px 0 8px !important;
}

.ele-dialog-view /deep/ .el-textarea__inner {
  box-shadow: var(--header-light-shadow);
  border-radius: 0 !important;
  min-height: 285px;
  height: 285px;
}

.ele-dialog-view /deep/ .el-checkbox__label {
  font-size: 12px !important;
}

.history_opticon_mod {
  font-weight: 700;
  color: #0080ff;
  margin-right: 5px;
}

.history_opticon_add {
  font-weight: 700;
  color: green;
  margin-right: 5px;
}

.history_opticon_del {
  font-weight: 700;
  color: #ff8080;
  margin-right: 5px;
}

.ele-left-layout {
  width: 186px;
  height: 262px;
  padding: 10px;
  margin-bottom: 10px;
  overflow-y: auto;
  border: 1px solid var(--border-color-base);
  box-shadow: var(--header-light-shadow);
}

.ele-right-layout {
  float: right;
  margin-top: 28px;
  width: 386px;
}
</style>
